<template>
	<view class="padd">
		<view class="plTab">
			<view class="plTabItem"
				:class="[index == tabIndex ? 'active' : '']"
				v-for="(item,index) in plTabArr"
				:key="index"
				@tap="switchPlTab(index)"
			>{{item.name}}</view>
		</view>
	</view>
</template>

<script>
	export default {
		props:{
			plTabArr:Array,
			tabIndex:Number
		},
		methods:{
			switchPlTab(index){
				this.$emit('switchPlTab',index)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.plTab{
		height: 48rpx;
		background: #FAF9FE;
		border-radius: 16rpx;
		padding: 6rpx;
		display: flex;
		.plTabItem{
			flex: 1;
			height: 48rpx;
			line-height: 48rpx;
			text-align: center;
			font-size: 28rpx;
			color: $qy-main6;
			&.active{
				color: $qy-main2;
				background: #fff;
				border-radius: 16rpx;
				box-shadow: 0px 0px 2px  rgba(0,0,0,.2);
			}
		}
	}
</style>